<script setup>
import { showImagePreview } from 'vant';
import 'vant/es/image-preview/style'

const props = defineProps({
  imgs: {type: Array, default: () => []}
})

// 图片预览
const imgPreview = (idx) => {
  showImagePreview({
    images: props.imgs,
    startPosition: idx
  });
}
</script>

<template>
  <div class="bg-white dark:bg-neutral-900 overflow-hidden">
    <van-swipe :autoplay="3000" lazy-render height="375">
      <van-swipe-item v-for="(image, idx) in imgs" :key="image">
        <img @click="imgPreview(idx)" class="w-full h-full object-contain" :src="image" alt="轮播图片"/>
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<style scoped lang="scss">

</style>